<template>
	<gui-page ref="guiPage" :customHeader="true">
		<!-- 导航 -->
		<template v-slot:gHeader>
			<nav-bar-custom left-icon="left"  :title="$t('设置上料优先级')"				
				@clickLeftBack="clickLeftBack" scanType="0"></nav-bar-custom>
		</template>

		<template v-slot:gBody>
			<view class="barcodeSplitting">
				<!-- 扫描条码部分 -->
				<view class="gui-bg-white gui-dark-bg-level-3 gui-padding-x distributed-head">
					<view class="custom-card-title">
						<text class="title-line"></text>
						{{ $t('Common.scanningInfo') }}
					</view>
					<view class="gui-form-item gui-border-b" style="padding: 20rpx 0;">
						<text class="item-info-title" style="padding-right: 40rpx;">
							<text class="required-color">*</text>
							{{ $t('distributedEnter.barcodeScan') }}
						</text>
						<uni-easyinput class="uni-mt-5" suffixIcon="scan" v-model="data.barCodes" type="search"
							:placeholder="$t('Common.scanningBarCode')" @confirm="confirm" @iconClick="iconClick">
						</uni-easyinput>
					</view>
				</view>

				<!-- 提示信息 -->
				<view class="gui-flex gui-rows gui-nowrap gui-align-items-center gui-margin-top">
					<view class="gui-title-line"></view>
					<text class="gui-primary-text gui-h6" style="padding-left:50rpx; padding-right:50rpx;">{{
		$t('hardwareOut.barcodeInformation') }}</text>
					<view class="gui-title-line"></view>
				</view>

				<!-- 条码展示部分 -->
				<scroll-view :show-scrollbar="false" :scroll-y="true" class="scroll">
					<view style="height: 15rpx"></view>
					<view class="card-boxCustom" v-if="data.cardShow">
						<view class="card-body">
							<view class="custom-card-title">
								<text class="title-line"></text>{{ $t('distributedOut.atPresent') }}
							</view>
							<view class="custom-card-itemOne">
								<text class="item-info-title">{{ $t('distributedOut.barcode') }}：</text>{{data.scanInfo.carton_no }}
							</view>
							<!-- <view class="custom-card-itemOne">
								<text class="body-item-title">{{
									$t('multilingual.productionLine') }}：</text>{{ data.scanInfo.productionLineCode }}
							</view> -->
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{ $t('distributedEnter.materialCode')
									}}：</text>{{ data.scanInfo.material_code }}
							</view>
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{ $t('distributedEnter.materialName')
									}}：</text>{{ data.scanInfo.material_name }}
							</view>
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{ $t('translationImage.productionTime')
									}}：</text>{{ data.scanInfo.output_time }}
							</view>
							<!-- <view class="custom-card-itemOne">
								<text class="body-item-title">{{
									$t('distributedEnter.materialSpec') }}：</text>{{ data.scanInfo.materialSpec }}
							</view> -->
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{ $t('distributedEnter.qty') }}：</text>{{data.scanInfo.qty}}
							</view>
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{$t('multilingual.state') }}：</text>{{ data.scanInfo.status }}
							</view>
							<!-- <view class="custom-card-itemOne">
								<text class="body-item-title">{{ $t('distributedEnter.uom') }}：</text>{{ data.scanInfo.unit
								}}
							</view>
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{
									$t('translationImage.process') }}：</text>{{ data.scanInfo.processCode }}
							</view>
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{ $t('distributedOut.warehouse')
								}}：</text>{{ data.scanInfo.warehouseCode }}
							</view> -->
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{ $t('distributedOut.location')
									}}：</text>{{ data.scanInfo.locationCode }}
							</view>
							
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{ $t('位置名称')
									}}：</text>{{ data.scanInfo.locationName }}
							</view>
							
							
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{ $t('产出产线') }}：</text>{{data.scanInfo.outLineCode}}
							</view>
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{$t('产出位置') }}：</text>{{ data.scanInfo.outLineName }}
							</view>
							<view class="custom-card-itemOne">
								<text class="body-item-title">{{$t('目前优先级') }}：</text>{{ data.scanInfo.attribute2 }}
							</view>
							
							<view class="custom-card-itemOne" style="padding: 20rpx 0">
								<text class="item-info-title">
									<text class="required-color">*</text>
									{{ $t('上料优先级') }}：
								</text>
								<uni-easyinput
									class="uni-mt-5"
									
									v-model="data.sort"
									placeholder="数字越大优先级越高"
									type="number"
								></uni-easyinput>
							</view>
						</view>
					</view>
				</scroll-view>

				<!-- 底部确定按钮 -->
				<view class="page-bottom-box bottom-postion">
					<view class="page-bottomBtn bottomBtn-bgcolor-green"  @click="submitConfirmFn">{{ $t('calendar.submit') }}</view>
					</view>
			</view>
		</template>
	</gui-page>
</template>

<script setup>
//引入文件
import { navigate, navigateBack } from '@/utils/routerSkip.js';
import { ref, reactive, onMounted, computed, watch, toRaw } from "vue";
import { getHgBarCodeResponse, setFeeedingSort } from '@/api/api.js'
import pdaScan from '@/hooks/pdaScan.js'
import storageBin from '@/components/storageBin.vue'
import comboGrid from '@/components/comboGrid.vue'
import { onBackPress } from '@dcloudio/uni-app';
import { useStore } from "vuex";
import { basPdaOperationLogFn } from '@/utils/index.js';
import superweiCombox from '@/components/superweiCombox';
import { USERINFO, OPERATION_COMMIT, OPERATION_LOOK, OPERATION_SCAN } from '@/constant/index.js'

//JS国际化引入
import { useI18n } from 'vue-i18n';
//注册组件
components: { comboGrid }
const { t } = useI18n();
let store = useStore();
const { scan } = pdaScan();

// 弹框的属性
let popup = ref(null);

const data = reactive({
	barCodes: '',  // 条码
	scanInfo: {}, //当前扫描信息
	cardShow:false, //是否展示条码卡片
	sort:''  // 优先级
})


onMounted(() => {
	uni.$on('scancodedate', (data) => {
		getCode(data.code, 'pda')
	})
})




// 扫描条码事件
const confirm = () => {
	getCode(data.barCodes, 'keydown')
}

// 扫描条码  监听用户使用相机
const iconClick = async (type) => {
	if (type === 'suffix') {
		let code = await scan();
		getCode(code, 'scan')
	}
}

const getCode = (code, type) => {
	if (code.length <= 0) {
		uni.showToast({ title: t('newTranslation.correctly'), icon: 'none' });
		return
	}
	
	data.barCodes = code;
	let parmes = {
		barcode: code
	}
	uni.showLoading({
		title: 'loading',
		mask: true
	});
	// 调用扫描的接口
	getHgBarCodeResponse(parmes).then(res => {
		uni.hideLoading();
		try {
			let inputParameter = '无'
			let returnParameter = JSON.stringify(data.barcodeList)
			let operationPicture = '设置上料优先级'
			let callInterface = '无'
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.message,//错误信息
				isPass: res.code == 200 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_SCAN,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
			// console.log(error)
		}
		if (res.code == 200) {
			data.scanInfo = res.result
			data.cardShow = true
	
		}
		else {
			uni.showToast({ title: res.message, icon: "none" });
			data.cardShow = false
		}
	})

}




// 提交弹框确定
const submitConfirmFn = () => {
	
	   const parmes={
		   barCode:data.barCodes,
		   sort:data.sort
	   }
	   
	   if(data.sort==''){
		   uni.showToast({
		   	    title:'上料优先级不能为空!',
				icon:'error'
		   })
		   return
	   }
	
		setFeeedingSort(parmes).then(res => {
			try {
				let inputParameter = '无'
				let returnParameter = JSON.stringify(data.barcodeList)
				let operationPicture = 'NG标记'
				let callInterface = '无'
				let opertionParmes = {
					inputParameter,
					returnParameter,
					operationPicture,
					callInterface,
					responseCode: res.code,//返回状态
					errorMessage: res.message,//错误信息
					isPass: res.code == 200 ? 'Y' : 'N',//是否成功 Y N
					operationType: OPERATION_COMMIT,
					module: 'WMS',
					source: "PDA",
				}
				basPdaOperationLogFn(opertionParmes)
			} catch (error) {
				// console.log(error)
			}
			// 接口调用成功执行
			if (res.code == 200) {
				// 清空数据
				data.scanInfo = {};
				data.cardShow = false
			   
				uni.showToast({ title: t('smashRemoval.submitSuccessfully'), icon: "none" });

			}
			else {
				uni.showModal({
					content: res.message,
					showCancel: false,
					confirmText: 'close'
				})

			}
		})
}



//导航栏左侧返回
const clickLeftBack = () => {
	navBackCheck()
}
const navBackCheck = () => {
	uni.navigateBack({
		delta: 1
	});
}
//点击物理按键的返回
onBackPress((options) => {
	if (options.from == 'backbutton') {
		uni.navigateBack({
			delta: 1
		});
		return true;
	}
})

</script>

<style lang="scss" scoped>
.barcodeSplitting {
	display: flex;
	flex-direction: column;
	height: calc(100vh - 88rpx);
	// height: 100vh;
}

.distributed-head {
	border-bottom-left-radius: 16rpx;
	border-bottom-right-radius: 16rpx;
}

.scroll {
	flex: 1;
	height: 2rpx;
}
</style>
